
html {
  height: 100%;
  overflow-x: hidden;
}

body {
  min-height: 100%;
  margin: 0;
  padding: 0;
}

body {position: relative;}

footer {position: absolute; bottom: 0;}
 
                                                   /* unvisited link */
body a:link {
  text-decoration:none;
  color:#1450aa;
}
                                                    /* fin unvisited link */
													
.s009{border-right:1px solid #FF6600;}


                                                  /* Input error dans formulaire */

.input-error1 {
    border: 1px solid red;
    background-color: #ffe6e6;
  }
  
.input-error2 {
    border: 1px solid red;
    background-color: #ffe6e6;
  }
  
                                                   /* fin Input error dans formulaire */
													
													
/* Texte courant / paragraphes */
body {
    font-family: 'Roboto', sans-serif;
    font-size: 16px;       /* taille desktop */
    line-height: 1.5;      /* confort de lecture */
    color: #111;           /* texte foncé */
    background-color: #fff;
}	

/* Titres principaux H1 */
h1 {
    font-family: 'Montserrat', sans-serif;
    font-size: 40px;       /* desktop */
    line-height: 1.2;
    font-weight: 700;
}

/* Sous-titres H2 */
h2 {
    font-family: 'Montserrat', sans-serif;
    font-size: 22px;
    line-height: 1;
    font-weight: 700;
}

/* Sous-sections H3 */
h3 {
    font-family: 'Roboto', sans-serif;
    font-size: 20px;
    font-weight: 500;
}												
	


/* Mobile : taille réduite */
@media (max-width: 768px) {
    body { font-size: 14px; }
    h1 { font-size: 32px; }
    h2 { font-size: 22px; }
    h3 { font-size: 18px; }
}	

/* Titres de section */
.v5 {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
}

/* Texte principal */
.o0037 {
    font-family: 'Roboto', sans-serif !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #111 !important;
}

/* Bloc (cartes) */
.o037 {
    font-family: 'Roboto', sans-serif !important;
    padding: 15px !important;
}

/* Titre dans chaque bloc */
.objectif b {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
}

.o72 .o28 {
    font-family: 'Roboto', sans-serif !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
    color: #666666 !important;
}

.o69 {
    font-family: 'Roboto', sans-serif !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #666666 !important;
}


													
													
												   /* banniere-label */ 
												
.banniere-label {
  border: 2px solid #000;
  padding: 5px 10px;
  margin: 30px auto;
  max-width: 95%;
  box-sizing: border-box;
  text-align: center;
  font-family: 'Georgia', serif;
  background-color: #fff;
  animation: fadeIn 1.5s ease;
}

 .banniere-label p {
  font-size: 1.3rem;
  margin: 0;
  line-height: 1.6;
  word-wrap: break-word;
}

.mot-important {
  color: #003d7a; 
}

/* Animation QUALITÉ (effet pulsant doux) */
@keyframes pulse {
  0% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.08); opacity: 0.8; }
  100% { transform: scale(1); opacity: 1; }
}

/* Animation d'apparition */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-20px); }
  to   { opacity: 1; transform: translateY(0); }
}

.btn-labellises {
  display: inline-block;
  margin-top: 15px;
  padding: 10px 20px;
  background-color: #005baa;
  color: white;
  text-decoration: none;
  font-weight: bold;
  border-radius: 5px;
  transition: background-color 0.3s ease;
}

.btn-labellises a{
  color: #FFFFFF;
}

.btn-labellises:hover {
  background-color: #003d7a;
}

/* Responsive */
@media (max-width: 768px) {
  .banniere-label p {
    font-size: 1.1rem;
  }
}

@media (max-width: 480px) {
  .banniere-label p {
    font-size: 1rem;
  }
}
													 /* Fin banniere-label */
													 
													 
													 
													 
													 
													 
													 /* Icones et Text */
.icone {
    font-size: 12px;           /* Taille icône ajustable */
}			 
													  /* Fin icones et Text */
													  
													  
													  
													  
													   /* alignement image et texte */

.liste-label{
margin-top:10px;
}

.item-label{
display:flex;
align-items:flex-start;
gap:2px;
margin-bottom:5px;
}

.item-label img{
width:20px;
height:10px;
margin-right:12px;
margin-top:8px;
}

.item-label p{
margin:0;
line-height:1.6;   /* réduit fortement l'espacement */
font-family:'Roboto', sans-serif !important;
font-size:16px !important;
color:#666666 !important;
}


@media screen and (max-width:768px){

.item-label{
align-items:flex-start;
gap:10px;
margin-bottom:14px;
}

.item-label img{
width:20px;
height:10px;
margin-top:5px;
}

.item-label p{
font-size:16px !important;
line-height:1.5;
}

}

                                                        /* Fin alignement image et texte */
														
														
														
														
														/* alignement image et texte 1 */


.liste-label1{
margin-top:10px;
}

.item-label1{
display:flex;
align-items:flex-start;
gap:2px;
margin-bottom:5px;
}

.item-label1 img{
width:8px;
height:8px;
margin-right:12px;
margin-top:8px;
}

.item-label1 p{
margin:0;
line-height:1.6;   /* réduit fortement l'espacement */
font-family:'Roboto', sans-serif !important;
font-size:14px !important;
color:#666666 !important;
}


@media screen and (max-width:768px){

.item-label1{
align-items:flex-start;
gap:10px;
margin-bottom:14px;
}

.item-label1 img{
width:8px;
height:8px;
margin-top:8px;
}

.item-label1 p{
font-size:15px !important;
line-height:1.5;
}

}


                                                              /* Fin alignement image et texte 1*/
															  
															  
															   /* alignement image et texte 2 */

.liste-label2{
margin-top:10px;
}

.item-label2{
display:flex;
align-items:flex-start;
gap:2px;
margin-bottom:5px;
}

.item-label2 img{
width:15px;
height:15px;
margin-right:12px;
margin-top:3.5px;
}

.item-label2 p{
margin:0;
line-height:1.4;   /* réduit fortement l'espacement */
font-family:'Roboto', sans-serif !important;
font-size:16px !important;
color:#666666 !important;
}

@media screen and (max-width:768px){

.item-label2{
align-items:flex-start;
gap:10px;
margin-bottom:14px;
}

.item-label2 img{
width:18px;
margin-top:5px;
}

.item-label2 p{
font-size:16px !important;
line-height:1.5;
}

}

                                                        /* Fin alignement image et texte 2 */
														
														
														/* alignement image et texte 3 */


.liste-label3{
margin-top:10px;
}

.item-label3{
display:flex;
align-items:flex-start;
gap:2px;
margin-bottom:5px;
}

.item-label3 img{
width:8px;
height:8px;
margin-right:12px;
margin-top:8px;
}

.item-label3 p{
margin:0;
line-height:1.6;   /* réduit fortement l'espacement */
font-family:'Roboto', sans-serif !important;
font-size:16px !important;
color:#666666 !important;
}


@media screen and (max-width:768px){

.item-label3{
align-items:flex-start;
gap:10px;
margin-bottom:14px;
}

.item-label3 img{
width:18px;
margin-top:5px;
}

.item-label3 p{
font-size:15px !important;
line-height:1.7;
}

}


                                                              /* Fin alignement image et texte 3*/
															  
															  
															  
														
														
														
														

	                                     /* css boutton de defilement vers le haut */

.retourHaut{
position:fixed;
text-align:center;
text-decoration: none;
bottom: 20px;
right: 20px;
z-index: 99;
display:none;
}

.retourHaut img{
    border-radius:5px;
}

.retourHaut:hover{
text-decoration:none;
}
                                        /* fin css boutton de defilement vers le haut */ 
													
													
                                               /* css tableau responsive */
/*striped row */

/* heading row */
th {background-color:#018DB1;font-weight:bold;color:#fff;}
/* first column bold */
tbody tr td:nth-of-type(1) {font-weight: normal;}
/* additional */
td, th {
  padding: 5px 8px 10px ;
  vertical-align:top;
  line-height: 150%;
}

@media screen and (max-width: 800px) {
table {width:100%;}
thead {display: none;}
tr td: {font-size:14px;}
tbody td {display: block;  text-align:left;}
tbody td:before { 
    content: attr(data-th); 
    display: block;
    text-align:left;  
  font-weight: normal;
  }
  tbody td::before {
  content: attr(data-th);
  display: none;
}
}
/* first column styling 
tbody tr td:nth-of-type(1) {font-weight: normal; background:#eaeaea;}*/

                                                        /* fin css tableau responsive */


              /* css tableau responsive : HTML associé <table class="table-responsive"> et CSS (grid-template-columns: repeat(2, 1fr); 1,2 ou 3) */

/* Table desktop normale */
.table-responsive {
  width: 100%;
  border-collapse: collapse;
}

.table-responsive th {
  background-color: #018DB1;
  font-weight: bold;
  color: #fff;
}

.table-responsive td,
.table-responsive th {
  padding: 8px;
  vertical-align: top;
  line-height: 150%;
}

/* MOBILE */
@media screen and (max-width: 800px) {

  .table-responsive {
    display: block;
  }

  .table-responsive thead {
    position: absolute;
    left: -9999px;
  }

  .table-responsive tbody {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 10px;
  }

  .table-responsive tr {
    display: block;
  }

  .table-responsive td {
    display: block;
    background: #f5f5f5;
    padding: 12px;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
  }

  .table-responsive td::before {
    content: attr(data-th);
    display: block;
    font-weight: bold;
    margin-bottom: 5px;
    color: #018DB1;
  }
}
             
		  /* Fin css tableau responsive : HTML associé <table class="table-responsive"> et CSS (grid-template-columns: repeat(2, 1fr); 1,2 ou 3) */


                                                          /* css image responsive */
.responsive {
  max-width: 100%;
  max-height: 50%;
}

.responsive04 {
  max-width: 100%;
  max-height: 50%;
  border-radius: 8px;
  height: auto;
}
                                                        /* fin css image responsive */

                                                 /* css barre de recherche dans menu responsive */									
.openBtn {
  background:white;
  padding: 5px 10px;
  border:none;
  font-size: 16px;
  cursor: pointer;
}

.overlay {
  height: 28%;
  width: 100%;
  display: none;
  position: fixed;
  z-index:99999;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
}

.overlay-content {
  position: relative;
  top: 30%;
  width: 80%;
  text-align: center;
  margin-top: 30px;
  margin: auto;
}

.overlay .closebtn {
  position: absolute;
  top: 20px;
  right: 45px;
  font-size: 60px;
  cursor: pointer;
  color: #ccc;
}

.overlay .closebtn:hover {
  color: white;
}

/*the container must be positioned relative:*/
.autocomplete {
  position: relative;
  display: inline-block;
}

.autocomplete1 {
  position: relative;
  display: inline-block;
}


input {
  border: 1px solid transparent;
  background-color: #f1f1f1;
  padding: 10px;
  font-size:14px;
  text-align: left;
}

input[type=text] {
  width: 100%;
  padding: 12px;
  margin: 8px 0;
  display: inline-block;
  box-sizing: border-box;
  font-weight: bold;
  font-size:12px;
  border-radius: 4px;
  text-align: left;
}

input[type=submit] {
  background-color: #FF6600;
  color: white;
  font-weight: bold;
  border: none;
  width: 50%;
  font-size:14px;
  text-align: center;
}

input[type=submit]:hover {
 background-color:green;
}

.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
}

.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
  background-color: #fff; 
  border-bottom: 1px solid #d4d4d4; 
  color: black;
}

/*when hovering an item:*/
.autocomplete-items div:hover {
  background-color: #e9e9e9; 
  color: black;
}

/*when navigating through the items using the arrow keys:*/
.autocomplete-active {
  background-color: DodgerBlue !important; 
  color: #ffffff; 
}

.autocomplete1-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
}

.autocomplete1-items div {
  padding: 10px;
  cursor: pointer;
  background-color: #fff; 
  border-bottom: 1px solid #d4d4d4; 
  color: black;
}

/*when hovering an item:*/
.autocomplete1-items div:hover {
  background-color: #e9e9e9; 
  color: black;
}

/*when navigating through the items using the arrow keys:*/
.autocomplete1-active {
  background-color: DodgerBlue !important; 
  color: #ffffff; 
}				
										         /* fin css barre de recherche dans menu responsive */
	  														
														
														/* css image de fond responsive */
														
.container {
  position: relative;
  max-width: 800px;
  margin: 0 auto;
}

.container img {vertical-align: middle;}

.container .content {
  position: absolute;
  bottom: 0;
  background: rgb(0, 0, 0); /* Fallback color */
  background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */
  color: #f1f1f1;
  width: 70%;
  padding: 0px;
}	

.m3{font-size: 24px;}

.container .content a{
	color: #f1f1f1;
  text-decoration: none;
  }
  
  .container1{
  text-align:center;
  }
  
  .content1 a{
  text-decoration: none;
  }													
	
                                                   /* fin css image de fond responsive */	
												   
												   
	  
	                                                     /* css menu responsive */
													  

 /* HEADER */
 
.site-header {
  display: flex;
  justify-content: space-between;
  flex-flow: row wrap;
  align-items: center;
  position: relative;
  
}

.site-branding {
  flex: 1 0 80%;
  max-width: 95%;
}

.site-title {
  font-size: 14px;
}


.site-header > .top-nav-label {
  flex: 0 0 auto;
  background:#1450aa;
  border-radius:4px;
}

  
  /* NAVIGATION */

.main-navigation {
  display: none;
  flex: 1 0 100%;
  
}

.main-navigation ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  text-align: left;
  width:auto;
}

  
  /* MENU PRINCIPAL */

.main-navigation .menu {
    width: 85%;         /* largeur du menu */
    margin-left: auto;  /* pousse le menu vers la droite */
    margin-right: 0;    /* pas de marge à droite */
    display: flex;      /* pour aligner les items en ligne */
    justify-content: flex-end; /* items alignés à droite */
    align-items: center; /* centre verticalement */
}

@media only screen and (min-width: 64em) {
  .main-navigation .menu-item-has-children > a::after {
      content: none !important;
      display: none !important;
  }
}


  /* ITEMS */

.main-navigation .menu .menu-item {
  position: relative;
}

.main-navigation .menu .menu-item a {
  background: #efefef;
  border: 0.0625rem solid #dcdcdc;
  color: #1450aa;
  display: block;
  padding: 0.4rem 0.8rem;
  text-decoration:none;
  white-space: nowrap;
}


  /* HOVER MENU */

.main-navigation .menu .menu-item a:hover {
  background: #1450aa;
  color: #efefef;
}

.main-navigation .menu .menu-item a:hover,
.main-navigation .menu .menu-item a:focus {
  background: #1450aa;
  color: #efefef;
}

.main-navigation .menu .menu-item a:active {
  background: #0b3d86;
  color: #efefef;
}


  /* SOUS MENU */
  
.main-navigation .sub-menu {
    display: none; /* caché par défaut */
    position: absolute;
	top:100%;
    left:0;
    background-color: #ffffff; /* fond blanc propre */
    border-radius: 0.25rem; /* coins arrondis */
    box-shadow: 0 4px 12px rgba(0,0,0,0.1); /* légère ombre pour relief */
    padding: 0.5rem 0;
    margin-top: 0.5rem; /* espace sous le menu parent */
    width: 245px;
    z-index: 999;
}

  /* afficher au hover */
  
.main-navigation .menu-item-has-children:hover > .sub-menu{
display:block;
}
 
  /* items du sous menu */
  
/* séparation entre les items du sous-menu */
.main-navigation .sub-menu .menu-item {
    border-bottom: 1px solid rgba(0,0,0,0.08);
}

/* supprimer le trait sur le dernier item */
.main-navigation .sub-menu .menu-item:last-child {
    border-bottom: none;
}
  
.main-navigation .sub-menu .menu-item a {
    display: block;
    padding: 0.6rem 1rem; /* plus de confort pour cliquer */
    font-size: 14px;
    color: #1450aa; /* texte bleu */
    text-decoration: none;
    transition: all 0.3s ease; /* effet hover doux */
    border-radius: 0.25rem; /* coins arrondis */
    /* gestion des textes longs */
    white-space: normal;
    line-height:1.4;
}


/* flèche du sous-menu */
.main-navigation .menu-item-has-children > .sub-menu::before{
content:"";
position:absolute;
top:-8px;
left:16px;
border-left:8px solid transparent;
border-right:8px solid transparent;
border-bottom:8px solid #ffffff;
}

/* supprimer la deuxième flèche générée par le thème */
.main-navigation .sub-menu::after,
.main-navigation .menu-item-has-children::after{
content:none !important;
display:none !important;
}


  /* hover sous menu */
.main-navigation .sub-menu .menu-item a:hover,
.main-navigation .sub-menu .menu-item a:focus {
    background-color: #018DB1; /* bleu clair au survol */
    color: #ffffff; /* texte blanc au hover */
}


  /* Si vous avez des sous-sous-menus - Sous-items plats */

.sub-sub-menu {
    list-style: none; /* on gère le point manuellement */
    padding-left: 1.2rem; /* décale légèrement vers la droite */
    margin: 0.2rem 0 0 0;
}

.sub-sub-menu li a {
    font-size: 14px;      /* un peu plus petit que le parent */
    color: #1450aa;
    text-decoration: none;
    display: block;
    padding: 0.25rem 0;
    transition: color 0.3s ease;
}

  /* petit point devant */
.sub-sub-menu li a:before{
content:"•";
position:absolute;
left:-10px;
color:#018DB1;
font-size:14px;
}

.sub-sub-menu li a:hover {
    color: #018DB1; /* couleur hover pour plus de visibilité */
}

.menu-item span {
	display: block; 
	padding: 10px 15px;
	color: #777;
	font-style: italic;
	background:white;
	font-style: normal;
}

.menu-item small {
	display: block; 
	color: #999;
	font-size:11px;
	margin-top: 3px;
}

.main-navigation .menu .menu-item .menu-item-has-children {
  border-right:1px solid #FF6600;
}

.main-navigation .menu .menu-item-has-children a {
  padding: 0.4rem 1rem; 
  font-size: 16px;
}

/* Hide/Show Main Menu if checkbox unchecked/checked */
.site-header > [type="checkbox"]:checked ~ .main-navigation {
  display: block;
}

/* Hide/Show Sub-Menu if checkbox unchecked/checked */
.main-navigation [type="checkbox"]:checked ~ ul {
  display: block;
}

/* Toggle buttons */
.top-nav-label {
  cursor: pointer;
  display: block;
  font-size: 0;
  margin: 0;
  overflow: hidden;
  padding: 0;
  
}

.top-nav-label .open-close-menu {
  display: block;
  position: absolute;
 
}

.top-nav-label .open-close-menu::before,
.top-nav-label .open-close-menu::after {
  border-radius: 0.1875rem;
  content: "";
  display: block;
  position: absolute;
}

/* Hamburger button */
.site-header > .top-nav-label {
  position: relative;
  right: 0;
  top: 0;
  height: 2.5rem;
  width: 2.5rem;
  border-radius: 0.1875rem;
  background:#1450aa;
  border-radius:4px;
}


.site-header > .top-nav-label .open-close-menu {
  background: #ffffff;
  border-radius: 0.1875rem;
  height: 0.25rem;
  left: 0.1875rem;
  right: 0.1875rem;
  top: 1.125rem;
  transition: 0.25s ease-in-out 0s;
}

.site-header > .top-nav-label .open-close-menu::before,
.site-header > .top-nav-label .open-close-menu::after {
  background-color: #ffffff;
  height: 0.25rem;
  left: 0;
  transition-duration: 0.3s, 0.3s;
  width: 100%;
}

.site-header > .top-nav-label .open-close-menu::before {
  top: -0.6875rem;
  transform-origin: top;
}

.site-header > .top-nav-label .open-close-menu::after {
  bottom: -0.6875rem;
  transform-origin: bottom;
}

/* Hamburger animation */
.site-header > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

.site-header > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
.site-header > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
  left: 0.125rem;
  transition-delay: 0s, 0.3s;
}

.site-header > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
  top: 0;
  transform: rotate(45deg);
}

.site-header > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
  bottom: 0;
  transform: rotate(-45deg);
}

/* Hamburger button hover/focus/active */
.site-header > .top-nav-label:hover,
.site-header > input[type="checkbox"]:focus ~ .top-nav-label,
.site-header > input[type="checkbox"]:hover ~ .top-nav-label {
  background: #1450aa;
}

.site-header > .top-nav-label:hover .open-close-menu,
.site-header > .top-nav-label:hover .open-close-menu::after,
.site-header > .top-nav-label:hover .open-close-menu::before,
.site-header > input[type="checkbox"]:focus ~ .top-nav-label .open-close-menu,
.site-header > input[type="checkbox"]:focus ~ .top-nav-label .open-close-menu::before,
.site-header > input[type="checkbox"]:focus ~ .top-nav-label .open-close-menu::after,
.site-header > input[type="checkbox"]:hover ~ .top-nav-label .open-close-menu,
.site-header > input[type="checkbox"]:hover ~ .top-nav-label .open-close-menu::before,
.site-header > input[type="checkbox"]:hover ~ .top-nav-label .open-close-menu::after {
  background: #efefef;
}

.site-header > input[type="checkbox"]:checked ~ .top-nav-label:hover .open-close-menu,
.site-header > input[type="checkbox"]:checked:focus ~ .top-nav-label .open-close-menu,
.site-header > input[type="checkbox"]:checked:hover ~ .top-nav-label .open-close-menu {
  background: none;
}

/* Plus/Minus button */
.main-navigation .menu-item-has-children > .top-nav-label {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.main-navigation .menu-item-has-children > .top-nav-label .open-close-menu {
  height: 100%;
  width: 100%;
  position:sticky;
}

.main-navigation .menu-item-has-children > .top-nav-label .open-close-menu::after,
.main-navigation .menu-item-has-children > .top-nav-label .open-close-menu::before {
  background: #1450aa;
  transition: transform 0.25s ease-out;
}

.main-navigation .menu-item-has-children > .top-nav-label .open-close-menu::before {
  height: 50%;
  left: calc(50% - 0.1875rem / 2);
  top: 25%;
  width: 0.1875rem;
}

.main-navigation .menu-item-has-children > .top-nav-label .open-close-menu::after {
  height: 0.1875rem;
  left: 25%;
  top: calc(50% - 0.1875rem / 2);
  width: 50%;
}

.main-navigation .menu-item-has-children a:hover ~ .top-nav-label,
.main-navigation .menu-item-has-children a:focus ~ .top-nav-label,
.main-navigation .menu-item-has-children a:active ~ .top-nav-label,
.main-navigation .menu-item-has-children:focus-within a ~ .top-nav-label {
  background: #efefef;
}

/* Plus/Minus button animation */
.main-navigation [type="checkbox"]:checked ~ .top-nav-label.open-close-menu::before {
  transform: rotate(90deg);
}

.main-navigation [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
  transform: rotate(180deg);
}

/* Plus/Minus button hover/focus/active */
.main-navigation .menu-item-has-children > .top-nav-label:hover {
  background: #1450aa;
}

.main-navigation .menu-item-has-children
  input[type="checkbox"]:focus ~ .top-nav-label {
  background: #1450aa;
}

.main-navigation .menu-item-has-children > .top-nav-label:hover .open-close-menu::after,
.main-navigation .menu-item-has-children > .top-nav-label:hover .open-close-menu::before,
.main-navigation .menu-item-has-children input[type="checkbox"]:focus ~ .top-nav-label .open-close-menu::before,
.main-navigation .menu-item-has-children input[type="checkbox"]:focus ~ .top-nav-label .open-close-menu::after {
  background: #efefef;
}

/* Hide and place checkbox over the toggle buttons */
.site-header input[type="checkbox"] {
  cursor: pointer;
  display: block;
  opacity: 0;
  position: absolute;
  z-index: 2;
}

.site-header > input[type="checkbox"] {
  right: 0.5rem;
  top: 2.75rem;
}

.site-header .menu-item-has-children input[type="checkbox"] {
  right: 1rem;
  top: 1rem;
}

/* Display the right label if checkbox checked */
.site-header input[type="checkbox"] + .top-nav-label .close-menu,
.site-header input[type="checkbox"]:checked + .top-nav-label .open-menu {
  display: none;
}

.site-header input[type="checkbox"]:checked + .top-nav-label .close-menu,
.site-header input[type="checkbox"] + .top-nav-label .open-menu {
  display: block;
}




/* RESTAURER LE HAMBURGER MOBILE */

.site-header{
display:flex;
justify-content:space-between;
flex-wrap:wrap;
align-items:center;
position:relative;
}

/* bouton hamburger visible */

.site-header > .top-nav-label{
display:block;
position:relative;
width:40px;
height:40px;
z-index:1001;
}

/* checkbox invisible mais fonctionnelle */

.site-header > input[type="checkbox"]{
position:absolute;
right:0;
top:0;
width:40px;
height:40px;
opacity:0;
z-index:1002;
cursor:pointer;
}

/* menu caché par défaut */

.main-navigation{
display:none;
width:100%;
}

/* menu visible quand hamburger cliqué */

.site-header > input[type="checkbox"]:checked ~ .main-navigation{
display:block;
}










/* MENU MOBILE VERTICAL */
@media (max-width:768px){

.main-navigation ul{
display:flex;
flex-direction:column; /* empile les éléments verticalement */
width:100%;
}

.main-navigation ul li{
width:100%;
}

.main-navigation ul li a{
display:block;
width:100%;
padding:12px 16px;
}

}



@media only screen and (min-width: 37.5em) {
  .site-title {
    font-size: 14px;
  }
}


@media only screen and (min-width: 64em) {
  .site-branding {
    flex: 1 0 30%;
    max-width: 30%;
  }

  .site-title {
    font-size: 14px;
  }

  .site-header input[type="checkbox"],
  .site-header .top-nav-label {
    display: none;
  }

  .main-navigation {
    display: block;
    flex: 1 0 70%;
    max-width: 70%;
  }

  .main-navigation .menu::before,
  .main-navigation .menu::after {
    display: none;
  }

  .main-navigation .menu > .menu-item {
    margin-left: 0.3125rem;
  }
  
  
  .main-navigation .menu {
    border: none;
    display: flex;
    justify-content: flex-end;
  }

  .main-navigation .menu .menu-item a{
    background: #fff;
    border: none;
    color: #1450aa;
    padding: 0;
  }
  
  .main-navigation .menu .menu-item a:hover {
    background: #1450aa;
    color: white;
    text-decoration: none;
  }
  
 .main-navigation .menu .menu-item a:active {
    color: #0b3d86;
    text-decoration: none;
  } 

  .main-navigation .menu-item-has-children > .top-nav-label {
    position: absolute;
    right: 0;
    top: 0;
    height: 2.5625rem;
    width: 2.5625rem;
  }
 
  .main-navigation .menu-item-has-children a:hover ~ .top-nav-label,
  .main-navigation .menu-item-has-children a:focus ~ .top-nav-label,
  .main-navigation .menu-item-has-children a:active ~ .top-nav-label,
  .main-navigation .menu-item-has-children:focus-within a ~ .top-nav-label {
    background: #FFFFFF;
  }
  
  .main-navigation .menu .menu-item-has-children a {
    padding: 0.4045rem 0.809rem;
  }

  .main-navigation .menu .menu-item-has-children > a::after {
    display: inline-block;
    content: "\25BE";
    margin-left: 0.4045rem;
    text-decoration: none;
    position: relative;
  }

  /* Show submenu on hover/focus */
  .main-navigation .menu-item-has-children > a:hover ~ ul,
  .main-navigation .menu-item-has-children:hover > a ~ ul,
  .main-navigation .menu-item-has-children > a ~ ul:hover,
  .main-navigation .menu-item-has-children > a:focus ~ ul {
    display: block;
    z-index: 999;
    pointer-events: auto;
  }

  /* Same rules - Focus-within not supported by Edge/IE. Unsupported selectors cause the entire block to be ignored, so we must repeat all styles separately. */
  .main-navigation .menu-item-has-children:focus-within > a ~ ul {
    display: block;
    z-index: 999;
  }

  .main-navigation .sub-menu::before {
    border-bottom: 0.5625rem solid #dcdcdc;
    border-left: 0.5625rem solid transparent;
    border-right: 0.5625rem solid transparent;
    border-top: 0 solid #dcdcdc;
    content: "";
    left: 30%;
    position: absolute;
    top: -0.5625rem;
  }

  .main-navigation .sub-menu::after {
    border-color: #fff transparent;
    border-style: solid;
    border-width: 0 0.5rem 0.5rem;
    content: "";
    left: calc(30% + 0.0625rem);
    position: absolute;
    top: -0.4375rem;
  }

  .main-navigation .sub-menu .sub-menu::before,
  .main-navigation .sub-menu .sub-menu::after {
    display: none;
  }
  
  .main-navigation .sub-menu .menu-item-has-children > a::before {
    content: "\25C4";
    vertical-align: top;
  }
  
  .main-navigation .sub-menu .menu-item-has-children > a::after {
    content: "";
    vertical-align: top;
  } 
   
 .main-navigation .menu-item-has-children .sub-menu .menu-item-has-children a {
	text-align: left;
    font-size: 14px;
  }
  
  .main-navigation .menu-item-has-children .sub-menu .menu-item-has-children .sub-menu {
	background-color: blue;
	color: white;
  }
  
  .main-navigation .menu-item-has-children .sub-menu .menu-item-has-children .sub-menu a {
	background-color: white;
	color: #1450aa;
  }
  
  .main-navigation .menu-item-has-children .sub-menu .menu-item-has-children a:focus {
	background-color: blue;
	color: white;
  } 
 
}

@media only screen and (min-width: 64em) and (any-pointer: coarse) {
  .main-navigation .menu .menu-item-has-children a {
    padding-right: 3rem;
  }

  .site-header .menu-item-has-children .top-nav-label {
    display: block;
  }

  .site-header .menu-item-has-children input[type="checkbox"] {
    display: block;
    right: 0.625rem;
    top: 0.625rem;
  }

  .main-navigation .menu-item-has-children > a:focus ~ ul,
  .main-navigation .menu-item-has-children > input[type="checkbox"]:not(:checked):focus ~ ul {
    display: none;
  }

  .main-navigation .menu .menu-item-has-children > a::after,
  .main-navigation .sub-menu .menu-item-has-children > a::after {
    display: none;
  }
   
}


@media only screen and (min-width: 100em) {
  .site {
    max-width: 80rem;
  }

  .site-title {
    font-size: 14px;
  }

  .main-navigation .sub-menu ul {
    left: 100%;
    top: 0;
    max-width: 100%;
  }
  
  .main-navigation ul {
    width: 100%;
  }
  
  .main-navigation .sub-menu .menu-item-has-children > a::after {
    content: "\25BA";
  }

}

@media screen and (max-width: 800px) {
.main-navigation .menu .menu-item-has-children .sub-menu .menu-item {
  width:90%; 
}
}









/* ===== MENU MOBILE ===== */

@media (max-width:768px){

/* menu pleine largeur */
.main-navigation .menu{
width:100%;
margin:0;
display:block;
}

/* supprimer les div wrapper qui cassent le layout */
.main-navigation .menu .s009{
width:100%;
}

/* chaque ligne du menu */
.main-navigation .menu .menu-item{
display:flex;
justify-content:space-between;
align-items:center;
width:100%;
}

/* lien du menu */
.main-navigation .menu .menu-item a{
flex:1;
text-align:left;
padding:14px 16px;
}

/* bouton toggle à droite */
.main-navigation .menu-item-has-children .top-nav-label{
position:relative;
width:40px;
height:40px;
right:0;
}

/* sous menu mobile */
.main-navigation .sub-menu{
position:relative;
width:100%;
box-shadow:none;
margin:0;
}

/* sous items */
.main-navigation .sub-menu .menu-item a{
padding-left:25px;
}

}





















/* ===== SOUS-MENU MOBILE ===== */

@media (max-width:768px){

/* désactiver ouverture au survol */
.main-navigation .menu-item-has-children:hover > .sub-menu{
display:none;
}

/* sous-menu sous le parent */
.main-navigation .sub-menu{
position:relative;
top:0;
left:0;
width:100%;
margin:0;
box-shadow:none;
border:none;
}

/* ouverture uniquement au clic */
.main-navigation .menu-item-has-children input[type="checkbox"]:checked ~ .sub-menu{
display:block;
}

/* style des sous-items */
.main-navigation .sub-menu .menu-item{
display:block;
width:100%;
}

.main-navigation .sub-menu .menu-item a{
padding:12px 20px;
text-align:left;
}

}



@media (max-width:768px){
.main-navigation .sub-menu::before{
display:none;
}
}





/* ===== SOUS MENU MOBILE SOUS LE PARENT ===== */

@media screen and (max-width: 800px){

/* sous-menu sous le parent */
.main-navigation .sub-menu{
position:relative !important;
top:auto !important;
left:auto !important;
width:100%;
margin:0;
border:none;
}

/* éviter les largeurs fixes */
.main-navigation .menu .menu-item-has-children .sub-menu .menu-item{
width:100%;
}

/* style sous items */
.main-navigation .sub-menu li{
width:100%;
display:block;
}

.main-navigation .sub-menu li a{
padding:12px 30px;
}
}



@media screen and (max-width:800px){

/* parent sur une ligne */
.main-navigation .menu-item{
display:flex;
align-items:center;
justify-content:space-between;
flex-wrap:wrap;
width:100%;
}

/* lien principal */
.main-navigation .menu-item > a{
flex:1;
}

/* bouton + */
.main-navigation .submenu-toggle{
margin-left:auto;
}

/* sous-menu sous le parent */
.main-navigation .sub-menu{
display:none;
width:100%;
position:relative !important;
margin-top:5px;
}

/* ouverture au clic */
.main-navigation .submenu-toggle:checked ~ .sub-menu{
display:block;
}

/* items du sous menu */
.main-navigation .sub-menu li{
display:block;
width:100%;
}

}





@media (max-width:768px){

/* fond blanc pour les colonnes de sous-menu */
.main-navigation .sub-menu{
background:#ffffff !important;
}

/* liens dans les sous-menus */
.main-navigation .sub-menu li a{
background:#ffffff !important;
color:#1450aa !important; /* garde la couleur du texte */
}

/* sous-sous-menu */
.main-navigation .sub-sub-menu{
background:#ffffff !important;
}

.main-navigation .sub-sub-menu li a{
background:#ffffff !important;
color:#1450aa !important;
}

}

				                                    /* fin css menu responsive */
													
													
													
													
													

                                                   /* css navigation collante  */


/* =============================== */
/* NAVIGATION COLLANTE */
/* =============================== */

.exemple{
min-height:0;
}

.test{
position:relative;
}

/* menu collant */
.scroll{
position:fixed;
top:0;
left:0;
width:100%;
z-index:9999;
}

/* correction mobile */

@media only screen and (max-width:800px){

.scroll{
position:static;   /* menu redevient normal */
width:100%;
}

}

                                                        /* fin css navigation collante  */
											  
.container0 {
  position: relative;
  max-width: 420px;
  margin: 0 auto;
}

.container0 img {vertical-align: middle;}

.container0 .content0 {
  position: absolute;
  top: 0;
  background: rgb(0, 0, 0); /* Fallback color */
  background: rgba(0, 0, 0, 0.2); /* Black background with 0.7 opacity */
  color: #ffffff;
  width: 25%;
  
  padding: 0px;
  text-align:center;
  
}


		
.item-align {
  display: flex;
  align-items: center; 
  justify-content: flex-start; /* centre horizontalement */
  gap: 8px; /* espace entre l’image et le texte */
  margin: 6px 0; 
}

.icon-img {

  max-width: 100%;
  max-height: 50%;
  border-radius: 8px;
  height: auto;
}





.liste-objectifs {
  max-width: 800px;
  margin: auto;
  padding: 20px;
}

.objectif {
  display: flex;
  align-items: flex-start;
  margin-bottom: 20px;
  font-family: 'Roboto', sans-serif !important;
  font-size: 16px !important;
  color: #666666 !important;
  
}

.numero {
  flex-shrink: 0;
  width: 30px;
  font-weight: bold;
  font-size: 1.2rem;
  line-height: 1.5;
}

.objectif p {
  margin: 0;
  flex: 1;
  line-height: 1.6;
  font-family: 'Roboto', sans-serif !important;
  font-size: 16px !important;
  color: #666666 !important;
}


@media screen and (max-width:768px){

.liste-objectifs{
padding:15px;
}

.objectif{
margin-bottom:18px;
gap:8px;
}

.numero{
width:25px;
font-size:1rem;
line-height:1.4;
}

.objectif p{
font-size:15px !important;
line-height:1.7;
}

}







.cta-container {
  text-align: center;
  margin: 40px 0; /* espace autour du bouton */
  color: white !important;
}

.cta-animated-button {
  display: inline-block;
  background-color: green;
  color: white !important;
  font-weight: 600;
  padding: 16px 50px; /* bouton élargi */
  min-width: 280px; /* largeur minimale */
  border-radius: 12px;
  text-decoration: none;
  font-family: 'Roboto', sans-serif !important;
  font-size: 16px !important;
  position: relative;
  overflow: hidden;
  transition: background-color 0.3s ease, transform 0.3s ease;
}


.cta-animated-button a{color: white !important; font-family: 'Roboto', sans-serif !important; font-size: 16px !important;}

.cta-animated-button::after {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.2);
  transform: skewX(-20deg);
  transition: left 0.5s ease;
}

.cta-animated-button:hover::after {
  left: 100%;
}

.cta-animated-button:hover {
  background-color: green;
  color: white;
  transform: scale(1.05);
}







.cta1-container {
  text-align: center;
  margin: 40px 0; /* espace autour du bouton */
  color: white !important;
}

.cta1-animated-button {
  display: inline-block;
  background-color: #FF6600;
  color: white !important;
  font-weight: 600;
  padding: 16px 50px; /* bouton élargi */
  min-width: 280px; /* largeur minimale */
  border-radius: 12px;
  text-decoration: none;
  font-family: 'Roboto', sans-serif !important;
  font-size: 16px !important;
  position: relative;
  overflow: hidden;
  transition: background-color 0.3s ease, transform 0.3s ease;
}

.cta1-animated-button a{color: white !important;   font-family: 'Roboto', sans-serif !important; font-size: 16px !important;}

.cta1-animated-button::after {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.2);
  transform: skewX(-20deg);
  transition: left 0.5s ease;
}

.cta1-animated-button:hover::after {
  left: 100%;
}

.cta1-animated-button:hover {
  background-color: #0056b3;
  transform: scale(1.05);
}



.containere10 {
  position: relative;
  text-align: center;
  color: #FFFFFF !important;
  font-family: 'Roboto', sans-serif !important;
}

.top-left {
  position: absolute;
  top: 25px;
  left:15px;
  font-family: 'Roboto', sans-serif !important;
}

.top-center {
  position: absolute;
  top: 405px;
  left: 0px;
}

.top-right {
  position: absolute;
  top: 25px;
  right: 50px;
  text-align:left;
  font-family: 'Roboto', sans-serif !important;
}

.v2 {font-weight:bold; color:white; font-size: 16px !important; font-family: 'Roboto', sans-serif !important;}
.v3 {color:#FFFFFF; font-size:14px;  text-align:left; width:100%;}
.v4 {color:#FFFFFF; font-size:24px; text-align:center; width:100%; }		
.v5 {font-size:20px !important; color:#FFFFFF; font-family: 'Roboto', sans-serif !important;}
.v6{border-radius:5px/5px; font-size: 16px !important; padding: 5px; font-family: 'Roboto', sans-serif !important; line-height:30px; color:#FFFFFF;}		
.v7{border-radius:5px/5px; border:1px solid #FFFFFF;}	
		
	@media only screen and (max-width: 800px) {	
	
	.top-right {right: 15px;}
	.v2 {font-weight:bold; color:white; font-size: 16px !important; font-family: 'Roboto', sans-serif !important;}
	.v3 {color:#FFFFFF; font-size:14px;  text-align:left; width:100%;}
    .v4 {color:#FFFFFF; font-size:18px; text-align:center; width:100%;}
    .v5 {font-size:14px; color:#FFFFFF;}
	.v6{border-radius:5px/5px; font-size: 16px !important; padding: 5px; font-family: 'Roboto', sans-serif !important; line-height:30px;}
}
	



.t0{ display:none;}		
.t1{font-size:14px; background:#666666; color:#FFFFFF; line-height: 1.6; padding:20px 10px; font-family:'Roboto', sans-serif;}
.t2{font-size: 12px; color: white;}
.t3{ font-size: 12px; color: white;}
.t4{color:#FFFFFF; font-size:14px;}
.t5{color:#FFFFFF; font-size:14px; font-family:'Roboto', sans-serif;}
.t6{color:#FFFFFF; font-size: 14px; font-family:'Roboto', sans-serif;}
.t6 a:link{color:#FFFFFF; font-size: 14px; font-family:'Roboto', sans-serif;}
.t7{color:#FFFFFF; text-align:center; font-family:'Roboto', sans-serif;}
.t7 a:link{color:#FFFFFF; text-align:center; font-family:'Roboto', sans-serif;}

.o1{font-size:12px; border: 1px solid #CCCCCC; color:#1450aa; border-radius: 5px/5px;}
.o2{font-size:12px; border-bottom: 1px solid #CCCCCC;}
.o4{ color:#CCCCCC; font-size:12px;}
.o8{ color:#FFFFFF; font-size:12px;}
.o9{ color:#FFFFFF; font-size: 16px !important; font-family: 'Roboto', sans-serif !important; text-align:center;}
.o09{ color:#FFFFFF; font-size:18px; font-family: Arial, Helvetica, sans-serif; font-weight:bold;}
.o90{ font-size: 16px !important; color:#666666; font-family: 'Roboto', sans-serif !important;}



.o10{ color:#FFFFFF;   font-family: 'Roboto', sans-serif !important; font-size: 16px !important;}
.o10 a:link{ color:#FFFFFF;   font-family: 'Roboto', sans-serif !important; font-size: 16px !important;}
.o11{ color:#CCCCCC; font-size:14px;}
.o011{ color:#FFFFFF; font-size:14px; font-weight:bold;}
.o011 a:link{ color:#FFFFFF; font-size:14px; font-weight:bold;}
.o14{ border: 1px solid white; color:#FFFFFF; border-radius: 10px/10px;}
.o17{font-size:12px; border: 1px solid #CCCCCC; color:#666666;}
.o18{font-size:12px; color:#666666;}

.o19{font-size: 20px !important; color:red; text-align:left; font-family: 'Roboto', sans-serif !important;}

.o190{font-size:18px; color:#666666; text-align:center;}
.o0019{font-size:18px; color:red; text-align:center;}
.o0019 a:link{font-size:18px; color:red; text-align:center;}

.o019{font-size:14px; color:#666666; text-align:center; }
.o21{border-bottom:1px dotted #CCCCCC;}
.o22{font-size:12px; border: 1px solid #CCCCCC; color:#1450aa; border-radius: 5px/5px;}
.o23{font-size:12px; color:#1450aa;}
.o23 a:link{font-size:12px; color:#1450aa;}
.o26{font-size:12px; color:#666666;}
.o28{font-family: 'Roboto', sans-serif !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
    color: #666666 !important;
	text-decoration: underline;
	}
	
.o28 a:link{font-family: 'Roboto', sans-serif !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
    color: #666666 !important;
	text-decoration: underline;
	}


.o01{font-size:14px; color:#1450aa; }
.o01 a:link{font-size:14px; color:#1450aa; }

.o280{font-size:12px; color:#666666; border:1px solid #666666; padding: 5px;}
.o280 a:link{font-size:12px; color:#666666; border:1px solid #666666; padding: 5px;}


.o29{border-right: 1px solid #CCCCCC;}
.o30{font-size:12px; color:#666666; border: 1px solid black; border-radius: 5px/5px; }
.o31{font-size:12px; border: 1px solid #CCCCCC; color:#1450aa; border-radius: 5px/5px;}
.o32{font-size:14px; color:#666666; text-align:center;}
.o33{color:red; text-align:center; font-size:14px;}
.o34{text-align:center;}
.o36{font-size:14px; color:#1450aa; text-align:center;}
.o35{border: 2px dotted red; padding:35px;}
.o37{font-size:14px; color:#666666 !important;}
.o037{border-radius:5px/5px; font-size: 14px !important; color:#666666 !important; padding: 20px; font-family: 'Roboto', sans-serif !important;}
.o0037{font-size: 14px !important; color:#666666 !important; font-family: 'Roboto', sans-serif !important;}

.o38{font-size:12px; color:red; text-align:center;}
.o40{font-size:18px; color:#666666;}
.o41{border: 1px solid #FFFFFF; border-radius: 5px/5px; font-size:14px;}
.o42{font-size:12px; color:#666666;}
.o43{color:#FFFFFF; font-size: 12px;}
.o43 a:link{color:#FFFFFF; font-size: 12px;}
.o46{font-size:14px; color:#1450aa; text-align:center;}
.o46 a:link{font-size:14px; color:#1450aa; text-align:center;}
.o47{font-size:16px; color:red;}
.o48{color:red; font-size:14px;}
.o48 a:link{color:red; font-size:14px;}
.o49{ color:#f1f1f1;}
.o49 a:link{ color:#f1f1f1;}
.o50{color:#FFFFFF; font-size: 12px;}
.o50 a:link{color:#FFFFFF; font-size: 12px;}
.o54{ display:none; }
.o56{ display:none; }
.o60{ color:#CCCCCC; font-size:14px;}
.o61{ color:#CCCCCC; font-size:12px;}
.o62{ color:#CCCCCC; font-size:14px;}
.o63{ color:#CCCCCC; font-size:14px;}
.o65{ border-bottom: 1px solid #CCCCCC;}
.o67{ color:#FFFF00;}


.o69{margin-left:15px; font-size:14px; text-align:left; text-decoration:underline; width:200px;}
.o69 a:link{margin-left:15px; font-size:14px; text-align:left; text-decoration:underline; width:200px;}


.o069{ display:none;}

.o70{ display:none;}
.o71{ display:none;}
.o72{ display:block;}

.o73{display:none;}

.o74{font-size:14px; color:red; text-align:left; text-decoration:underline; width:200px;}
.o74 a:link{font-size:14px; color:red; text-align:left; text-decoration:underline; width:200px;}



.o80{font-size:12px; border: 1px solid #CCCCCC; color:#1450aa; border-radius: 50px/50px;}
.o81{border: 1px solid #CCCCCC; border-radius: 5px/5px;}
.o081{border: 2px solid #FF6600; border-radius: 5px;}
.o82{Position: absolute; top: 775px; left: 223px; border: 1px solid #FFFFFF; border-radius: 5px/5px; display:block;}
.o83{Position: absolute; top: 243px; left: 65px; display:none; padding:0px; margin:0px;}
.o85{font-size:12px; border: 1px solid #CCCCCC; color:#1450aa; border-radius: 50px/50px; display:block;}

@media only screen and (max-width: 800px) {
	
.o73{display:block; text-align:center; font-size:14px; color:red;}
.o73 a:link{text-align:center; font-size:14px; color:red;}

.o76{border: 1px solid #FF6600; width:160px;}
	
	
.o80{max-width:100%; font-size:12px; border: 1px solid #CCCCCC; color:#1450aa; border-radius: 50px/50px; text-align: center;}	
.o82{position: absolute; top: 570px; left: 75px; width: 70%; display:none;}
.o83{display:block; z-index: 1; width:70%; text-align: center; padding:0px; margin:0px;}
.o84{font-size:14px; color:#1450aa; text-align: center;}
.o85{font-size:12px; border: 1px solid #CCCCCC; color:#1450aa; border-radius: 50px/50px; display:none;}	


.o01{font-size:12px; color:#1450aa; }
.o01 a:link{font-size:12px; color:#1450aa; }	
	
.o70{ display:block; text-align:center; max-width:100%;}	
.o71{display:block; text-align:center;}
.o72{ display:none;}
	
.o4{ color:#666666; font-size:12px;}
.o9{ text-align:center;}
.o09{text-align:center;}
.o90{ font-size: 16px !important; color:#666666; font-family: 'Roboto', sans-serif !important;}


.o090{ margin-left:15px; font-size:14px; color:#666666; font-family: Arial, Helvetica, sans-serif;}


.o20{border-spacing: 0; border-collapse : collapse; background:#FFFFFF; width:100%;}
.o037{ border-radius:5px/5px; padding: 20px; font-size: 14px !important; font-family: 'Roboto', sans-serif !important; border-bottom:1px solid #CCCCCC;}
.o0037{font-size: 14px !important; color:#666666; font-family: 'Roboto', sans-serif !important;}
.o22{ font-size:12px; text-align:center;}
.o45 {display: none;}
.s2{ text-align:center; }
.so02{ text-align:center; }

.o19{font-size:14px; text-align:left; font-weight:bold;}

.o019{font-size:14px; text-align:center; font-weight:bold;}
.o0019{font-size:12px; color:red; text-align:center; font-weight:bold;}
.o0019 a:link{font-size:18px; color:red; text-align:center;}
.o35{font-size:14px; text-align:center;}
.o47{font-size:14px; text-align:center;}
.o51{border: 1px solid #FFFFFF; border-radius: 5px/5px;}
.o57{border: 1px solid #FFFFFF; border-radius: 5px/5px; background-color:#FFFFFF; color: #666666;}
.o58{background-color:#FFFFFF; color: #666666;}
.o59{display:none;}
.o28{font-size:14px; color:#666666;}
.o28 a:link{font-size:14px; color:#666666;}
.o29{ border: 1px solid #CCCCCC; border-radius: 5px/5px;}
.o52{ border: 1px solid #CCCCCC; border-radius: 5px/5px;}
.o41{border: 1px solid #CCCCCC; border-radius: 5px/5px;}
.o53{ display:none; }
.o54{ display:inline-block; text-align:center; width:96.5%;}
.o11{ color:red; font-size:14px; font-weight:bold;}
.o60{ color:#CCCCCC; font-size:14px;}
.o61{ color:#CCCCCC; font-size:12px;}
.o62{ color:#FFFFFF; font-size:14px;}
.o63{ color:#666666; font-size:14px;}
.o64{text-align:center; padding:0; margin:0;}
.o65{ display:none;}
.o75{ display:none;}
.o66{border-spacing:5px; border-collapse:collapse;}
.o67{ margin:10px auto auto auto;}
.o68{background-color:#FFFFFF;}

.o69{display:none;}
.o069{ display:block; font-size:14px; text-align:center;}
.o74{display:none;}

.s00{text-align:center;}
.s001{text-align:center;}
.respons0{max-width:100%; height:90px;}
.respons{max-width:100%; height:50px;}
.responsive {max-width:100%;}
.responsive05 {max-width:100%;}
.responsive02 {max-width:100%; height:70%;}
.responsive001 {max-width:55%; height:55%;}
.responsive01 {max-width:70%; height:70%;}
.responsive03 {max-width:100%; height:30%; }
.container12 .content7 {width: 100%; text-align:left; font-size: 10px;}
.container12 {max-width: 100%; margin: 0 auto;}
.openBtn {border:1px solid #CCCCCC;}
.o010{display:none;}
.t0{ display:block; text-align:center; max-width:100%;}
.t3{display:none;}
.t5{text-align:center;}

}


                                                           /* vidéo de fond */


.container10 {
  position: relative;
  max-width: 800px;
  margin: 0 auto;
}

.container10 img {vertical-align: middle;}

.container10 .content5 {
  position: absolute;
  bottom: -120px;
  background: rgb(0, 0, 0); /* Fallback color */
  background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */
  color: #f1f1f1;
  width: 100%;
  padding: 0px;
  text-align:center;
}

.responsive {
  max-width: 100%;
 max-height: 50%;
}


                                                          /* fin vidéo de fond */
														  
														  
																	   
																	     
																	  
																	  
																	    /* image de fond */


.container11 {
  position: relative;
  max-width: 800px;
  margin: 0 auto;
}

.container11 img {vertical-align: middle;}

.container11 .content6 {
  position: absolute;
  bottom: 0px;
  background: rgb(0, 0, 0); /* Fallback color */
  background: rgba(0, 0, 0, 0.1); /* Black background with 0.5 opacity */
  color: #f1f1f1;
  width: 90%;
  padding: 0px;
  text-align:left;
}

.responsive {
 max-width: 100%;
 max-height: 50%;
}


                                                          /* fin image de fond */
														  
														  
														  /* image de fond gros plans */


.container12 {
  position: relative;
  max-width: 1150px;
  margin: 0 auto;
  text-align: center;
}

.container12 img {vertical-align: middle;}

.container12 .content12 {
  position: absolute;
  bottom: 150px;
  left: 20px;
  background: rgb(0, 0, 0); /* Fallback color */
  background: rgba(0, 0, 0, 0.0); /* Black background with 0.5 opacity */
  color: #FFFFFF;
  width: 96.5%;
  padding: 20px;
  text-align: center;
}


.responsive12 {
  max-width: 100%;
  max-height: 50%;
}

@media only screen and (max-width: 800px) {
	
 .container12 {
  position: relative;
 
  margin: 0 auto;
}

.container12 img {vertical-align: middle;}

.container12 .content12 {
  position: absolute;
  top: 15px;
  background: rgb(0, 0, 0); /* Fallback color */
  background: rgba(0, 0, 0, 0.0); /* Black background with 0.5 opacity */
  color: #FFFFFF;
  width: 90%;
  padding: 5px;
  text-align:center;
  font-size:12px;
}

.responsive12 {
  max-width: 100%;
  max-height: 50%;
}
}




                                                          /* fin image de fond gros plans */
														  
														  
														  
														  
														   /* css video autoplay muet responsive */
section {text-align: center;}
.o44{ width:250px;  background-color:#FFFFFF; margin:10px; display:inline-block;}

																	 
.video-responsive {
  overflow: hidden;
  padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
  position: relative; 
  height:0;
  
}

.video-responsive iframe {
  top: 0;
  left: 0;
  width: 100%;
  height:100%;
  position: absolute;
}
                                                        /* fin css video autoplay muet responsive */
														
														
#more1 {display: none;}	
#more2 {display: none;}													



* {box-sizing: border-box;}

.mySlides {display: none;}
img {vertical-align: left;}

/* Slideshow container */
.slideshow-container {
  max-width: 1152px;
  position: relative;
  margin: 0px;
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  height: 5px;
  width: 5px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active {
  background-color: #717171;
}

/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 1.5s;
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .text {font-size: 11px}
}
		




/* =============================== */
/* CSS COOKIES */
/* =============================== */

#cookie-banner {
    position: fixed;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(255, 255, 255, 1);
    color: #333;
    padding: 10px 15px;
    width: 100%;
    max-width: 1000px;
    border-radius: 12px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    text-align: center;
    font-size: 15px;
    z-index: 9999;
  }

  #cookie-banner p {
    margin-bottom: 12px;
    font-weight: 500;
  }

  #cookie-banner a {
    color: #005f99;
    text-decoration: none;
    font-weight: bold;
  }

  #cookie-banner a:hover {
    text-decoration: underline;
  }

  #cookie-banner .cookie-buttons {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 12px;
  }

  #cookie-banner button {
    padding: 10px 20px;
    border: none;
    border-radius: 25px;
    background-color: #005f99;
    color: white;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease;
  }

  #cookie-banner button:hover {
    background-color: #003f66;
  }

  @media screen and (max-width: 500px) {
    #cookie-banner {
      font-size: 14px;
      padding: 15px;
    }

    #cookie-banner button {
      padding: 8px 14px;
      font-size: 14px;
    }
  }
					
		
/* =============================== */
/* CSS FIN COOKIES */
/* =============================== */	
		
		
		
		

/* =============================== */
/* FOOTER PRO QUALIFIE */
/* =============================== */

/* container principal */

.footer-container{
max-width:1174px;
margin:auto;
display:flex;
justify-content:space-between;
gap:40px;
flex-wrap:wrap; /* important pour mobile */
}

/* colonnes */

.footer-col{
flex:1;
font-size:14px;
text-align:left; 
color:#ffffff;
}

.footer-col1{
flex:1;
font-size:14px;
text-align:left; 
background:#666666;
}

/* titres */

.footer-col h3{
color:#ffffff;
font-size:16px;
margin-bottom:15px;
text-decoration:underline; /* titres soulignés */
}

/* texte */

.footer-col p{
color:#ffffff;
line-height:1.6;
}

/* liste */

.footer-col ul{
list-style:none;
padding:0;
margin:0;
}

.footer-col li{
margin-bottom:8px;
}

/* liens */

.footer-col a{
color:#ffffff;
text-decoration:none;
transition:0.3s;
}

.footer-col a:hover{
text-decoration:underline;
}

/* réseaux sociaux */

.footer-social a{
margin-right:12px;
color:#ffffff;
text-decoration:none;
}

/* partie basse */

.footer-bottom{
text-align:center;
margin-top:30px;
font-size:14px;
color:#ffffff;
border-top:1px solid rgba(255,255,255,0.3);
padding-top:15px;
}

.footer-bottom a{
color:#ffffff;
text-decoration:none;
margin:0 6px;
}

.footer-bottom a:hover{
text-decoration:underline;
}




/* =============================== */
/* VERSION MOBILE FOOTER */
/* =============================== */

@media (max-width:768px){

.footer-container{
flex-direction:column;
text-align:center;
}

.footer-col{
width:100%;
}

.footer-social{
margin-top:10px;
}

}


/* CENTRER LE FOOTER SUR MOBILE */

@media only screen and (max-width:900px){

.footer-table{
width:100% !important;
max-width:100% !important;
margin:0 auto;
}

/* centrer tout le contenu */

.footer-container{
display:flex;
flex-direction:column;
align-items:center;
text-align:center;
}

/* colonnes du footer */

.footer-col,
.footer-col1{
width:100%;
margin-bottom:25px;
text-align:center;
}

/* centrer les listes */

.footer-col ul{
padding-left:0;
list-style:none;
}

/* centrer les icones */

.footer-social{
display:flex;
justify-content:center;
gap:10px;
}

/* centrer le bas du footer */

.footer-bottom{
text-align:center;
padding:15px 10px;
}

}


/* REDUIRE LES ESPACES ENTRE LES BLOCS DU FOOTER SUR MOBILE */

@media only screen and (max-width:900px){

.footer-container{
display:flex;
flex-direction:column;
align-items:center;
text-align:center;
gap:8px; /* espace entre colonnes réduit */
}

.footer-col,
.footer-col1{
width:100%;
margin-bottom:10px; /* espace vertical réduit */
padding:5px 0;
}

/* réduire espace titres */

.footer-col h3{
margin-bottom:8px;
}

/* réduire espace des listes */

.footer-col ul{
margin:0;
padding:0;
}

.footer-col ul li{
margin-bottom:4px;
}

}


/* =============================== */
/* FIN CSS VERSION MOBILE FOOTER */
/* =============================== */




/* =============================== */
/* CSS zone partenaires */
/* =============================== */

.header-partenaires{
margin-left:0;
}

/* titre */

.titre-partenaire{
font-family:'Roboto', sans-serif;
font-size:14px;
color:#FFFFFF;
padding-right:10px;
white-space:nowrap;
}

/* conteneur */

.carousel-partenaires{
width:200px;
height:100px;
overflow:hidden;
position:relative;
border-left: 4px solid #FFFFFF;
}

/* logos */

.logo-partenaire{
position:absolute;
left:15px;
top:0;
opacity:0;
animation:carouselLogos 15s infinite;
}

/* animation */

.logo-partenaire:nth-child(1){
animation-delay:0s;
}

.logo-partenaire:nth-child(2){
animation-delay:3s;
}

.logo-partenaire:nth-child(3){
animation-delay:6s;
}

.logo-partenaire:nth-child(4){
animation-delay:9s;
}

.logo-partenaire:nth-child(5){
animation-delay:12s;
}

@keyframes carouselLogos{

0%{
opacity:0;
transform:translateY(10px);
}

10%{
opacity:1;
transform:translateY(0);
}

25%{
opacity:1;
}

35%{
opacity:0;
}

100%{
opacity:0;
}

}

/* =============================== */
/* FIN CSS zone partenaires */
/* =============================== */




/* =============================== */
/* CSS barre supérieure */
/* =============================== */

.top-bar{
max-width:1150px;
margin:auto;
background:#ffffff;
border-bottom:1px solid #e5e5e5;
}

.top-bar-container{
width:100%;
display:flex;
justify-content:space-between;
align-items:center;
padding:6px 0;
gap:15px; /* espace propre */
}

/* icones social */

.social-icons{
display:flex;
align-items:center;
}

.social-icons img{
width:30px;
height:30px;
object-fit:contain;
margin-right:10px;
}

/* boutons */

.top-links{
display:flex;
gap:10px;
}

.btn-green{
background:#1aa34a;
color:white !important;
padding:8px 14px;
text-decoration:none;
font-family:'Roboto',sans-serif;
font-size:14px;
border-radius:4px;
transition:0.3s;
}

.btn-blue{
display:flex; /* important */
align-items:center; /* centrage vertical */
justify-content:center;
background:#1450aa;
color:white !important;
padding:0 14px; /* on enlève padding vertical */
height:30px; /* même hauteur que icônes */
text-decoration:none;
font-family:'Roboto',sans-serif;
font-size:14px;
border-radius:4px;
transition:0.3s;
}

.btn-blue a{
display:flex;
align-items:center;
height:100%;
color:white !important;
text-decoration:none;
}

.btn-green::after{
content:" ▼";
font-size:10px;
margin-left:4px;
}

.btn-green:hover{
background:#14853b;
color:white !important;
}


.menu-item input{
display:none;
}


/* =============================== */
/* FIN CSS barre supérieure */
/* =============================== */





/* =============================== */
/* CSS MEGA MENU */
/* =============================== */

.menu-item{
position:relative;
}

/* mega menu */

.mega-menu{
position:absolute;
top:40px;
right:0;
width:900px;
min-height:450px; /* ajuste selon ton design */
background:#fff;
border:1px solid green;
box-shadow:0 4px 15px rgba(0,0,0,0.1);
display:flex;
opacity:0;
visibility:hidden;
transition:0.3s;
z-index:999;
max-height:80vh;
overflow-y:auto;
}

/* mega menu desktop : hover */
@media (min-width:901px){

.menu-item:hover .mega-menu{
opacity:1;
visibility:visible;
}

}


/* partie gauche */

.mega-left{
width:50%;
padding:20px;
display:flex;
flex-direction:column;
gap:10px;
font-family:'Roboto',sans-serif;
font-size:18px;
color:#1450aa;
}

.mega-left a{
text-decoration:none;
font-family:'Roboto',sans-serif;
font-size:18px;
color:#1450aa;
}

.mega-left a:hover{
color:#555;
}

/* image droite */

.mega-right{
width:50%;
}

.mega-right img{
width:100%;
height:100%;
object-fit:cover;
}


/* partie gauche mega-left1 */

.mega-left1{
width:60%;
padding:20px;
flex-direction:column;
gap:15px;
font-family:'Roboto',sans-serif;
font-size:18px;
color:#1450aa;
}

.mega-left1 b{
grid-column:span 2;
font-size:18px;
color:#000;
margin-bottom:10px;
}

.mega-left1 br{
display:none;
}

.mega-left1 a{
text-decoration:none;
font-family:'Roboto',sans-serif;
font-size:18px;
color:#1450aa;
}

.mega-left1 a:hover{
color:#555;
}

.section-header{
margin-bottom:10px;
}

.section{
display:flex;
flex-direction:column;
}

.section .title{
font-weight:bold;
color:#1aa34a;
margin:10px 0 5px;
font-size:18px;
}

.menu-block{
padding-bottom:12px;
margin-bottom:12px;
transition:0.3s;
}

.menu-block:hover{
border-bottom:1px solid #1aa34a;
}

.menu-block:last-child{
border-bottom:none;
margin-bottom:0;
}


/* image droite */

.mega-right1{
width:55%;
height:100%;
display:flex;
overflow:hidden;
border-left:1px solid #eee;
justify-content:center;
padding:30px 20px;
align-items:center; /* centre vertical */
box-sizing:border-box;
}

.mega-right1 img{
width:100%;
height:100%;
object-fit:contain; /* clé du problème */
object-position:center; /* centre l'image */
display:block;
}


/* liens du sous menu dans mega menu */

.mega-left a{
display:block;
text-decoration:none;
color:#1450aa;
font-family:'Roboto', sans-serif;
font-size:18px;
padding:6px 0;
position:relative;
transition:0.3s;
}

/* point devant chaque lien dans mega menu*/

.mega-left a::before{
content:"•";
color:#1aa34a;
margin-right:8px;
font-size:18px;
}

/* trait en dessous dans mega menu */

.mega-left a::after{
content:"";
position:absolute;
left:0;
bottom:0;
width:0;
height:1px;
background:#1aa34a;
transition:0.3s;
}

/* effet hover dans mega menu*/

.mega-left a:hover{
color:#1aa34a;
}

.mega-left a:hover::after{
width:100%;
}


/* liens du sous menu dans mega-left1 */

.mega-left1 a{
display:block;
text-decoration:none;
color:#1450aa;
font-family:'Roboto', sans-serif;
font-size:18px;
padding:6px 0;
position:relative;
transition:0.3s;
}

.cta-animated-button a{
font-size:14px;
padding:8px 14px;
border-radius:6px;
display:inline-block;
font-weight:600;
}

/* point devant chaque lien dans mega menu*/

.mega-left1 a::before{
content:"•";
color:#1aa34a;
margin-right:8px;
font-size:18px;
}

.cta2-animated-button::before{
content:none !important;
}

/* trait en dessous dans mega menu */

.mega-left1 a::after{
content:"";
position:absolute;
left:0;
bottom:0;
width:0;
height:1px;
background:#1aa34a;
transition:0.3s;
}

/* effet hover dans mega menu*/

.mega-left1 a:hover{
color:#1aa34a;
}

.mega-left1 a:hover::after{
width:100%;
}


/* =============================== */
/* FIN CSS MEGA MENU */
/* =============================== */






/* ================= MOBILE ================= */

/* Rendre la barre responsive */


@media only screen and (max-width:900px){

.top-bar{
position:relative;
z-index:9999;
overflow: visible; /* laisser le mega-menu sortir */
max-width: 100%;
box-sizing: border-box;
}

.top-bar-container{
width:100%;
max-width:100%;
margin:auto;
padding:6px 10px;
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:nowrap;   /* empêche les retours à la ligne */
box-sizing: border-box;
}

/* icones */

.social-icons{
align-items:center;
}

.social-icons img{
margin-right:2px;
}


/* boutons */

.top-links{
display:flex;
gap:6px;
align-items:center;
}

.btn-green{
font-size:12px;
padding:7px 10px;
white-space:nowrap;
display:inline-block;
}

}


/* écrans très petits */

@media only screen and (max-width:480px){

.btn-green{
font-size:11px;
padding:6px 8px;
}

/* icones */

.social-icons{
align-items:center;
}

.social-icons img{
width:30px;
margin-right:8px;
}

}

@media only screen and (max-width: 900px) {
  .btn-green {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.2;
    padding: 5px 10px;
    gap: 2px;
  }

  .btn-green::after {
    content: "▼";
    font-size: 8px;
    margin-left: 0;
  }
}



@media (max-width:900px){

.section-header{
margin-bottom:15px;
}

.section .title{
font-size:18px;
margin-top:15px;
}

}



/* Adapter le mega menu pour mobile */ 

@media only screen and (max-width:900px){

/* cacher les checkbox partout */
.menu-item input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
}


/* mega menu mobile */
@media (max-width:900px){

.mega-menu{
position:fixed;
top:50px;
left:0;
width:100vw;
height:calc(100vh - 50px);

background:white;
display:block; /* 🔥 IMPORTANT : PAS FLEX */

opacity:0;
visibility:hidden;
z-index:9999;

/* 🔥 SCROLL ICI */
overflow-y:auto;
-webkit-overflow-scrolling: touch;
}

/* ouverture au clic */

.menu-item input:checked ~ .mega-menu{
opacity:1;
visibility:visible;
}

/* bloquer le scroll arrière */
body.menu-open{
overflow:hidden;
}

.menu-block{
border-bottom:1px solid rgba(0,0,0,0.05); /* ultra léger */
padding-bottom:12px;
margin-bottom:12px;
}

.menu-block:last-child{
border-bottom:none;
}

/* liens */

.mega-left{
width:100%;
max-width:100%;
padding:20px 16px; /* 🔥 padding équilibré mobile */
box-sizing:border-box;
}

.mega-left a{
display:block;
padding:10px 0;
font-family:'Roboto',sans-serif;
font-size:18px;
text-decoration:none;
color:#1450aa;
line-height:1.4;
}

.mega-left1{
width:100%;
max-width:100%;
padding:20px 16px; /* 🔥 padding équilibré mobile */
box-sizing:border-box;
}

.mega-left1 a{
display:block;
padding:10px 0;
font-family:'Roboto',sans-serif;
font-size:18px;
text-decoration:none;
color:#1450aa;
line-height:1.4;
}

.mega-right{
display:none;
}

.mega-right1{
display:none;
}

}


/* ================= FIN MOBILE ================= */






/* =============================== */
/* CSS ACCORDEON */
/* =============================== */


.referentiels {
  padding: 40px;
  font-family: 'Roboto', sans-serif !important;
}

.grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

.card {
  background: white;
  border-radius: 12px;
  padding: 10px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.08);
}

.accordion {
  background-color: #1450aa;
  color: #fff;
  font-family: 'Roboto', sans-serif !important;
  cursor: pointer;
  padding: 12px;
  width: 100%;
  border: none;
  text-align: left;
  font-size: 16px;
  border-radius: 8px;
  position: relative; /* pour que le + soit positionné */
  display: flex;
  align-items: center;
  gap: 10px;
  padding-right: 50px; /* espace pour le + */
}

.accordion .icon {
  width: 30px;
  text-align: center;
  margin-right: 10px;
  flex-shrink: 0;
}

.accordion .title {
  flex: 1; /* pousse le + à droite */
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.accordion:after {
  content: '+';
  position: absolute;
  right: 20px; /* distance du bord droit */
  top: 50%;
  transform: translateY(-50%);
  font-weight: bold;
}

.accordion.active:after {
  content: '-';
}

.panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  padding: 0 10px;
}

.panel ul {
  padding-left: 20px;
}


.badge {
  font-size: 12px;
  padding: 4px 10px;
  border-radius: 20px;
  white-space: nowrap;
}

.badge.dev {
  background: #f0ad4e;
  color: white;
  padding: 3px 8px;
  border-radius: 5px;
  font-size: 12px;
  margin-left: 10px;
}

.badge.venir {
  background: #999;
  color: white;
  padding: 3px 8px;
  border-radius: 5px;
  font-size: 12px;
  margin-left: 10px;
}


/* =============================== */
/* FIN CSS ACCORDEON */
/* =============================== */































































































































														  
                                        /* css image slider découvrez toutes nos catégories responsive  */
																	   

.mySlides {display: none}
img {vertical-align: middle;}

/* Slideshow container */
.slideshow-container {
  width:100%;
  position: relative;
  margin: auto;
 
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 30%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: white;
  background:#CCCCCC;
  font-weight: bold;
  font-size: 12px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: -5px;
  border-radius: 3px 0 0 3px;
}

.prev {
  left: -5px;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: #CCCCCC;
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/10 etc) */
.numbertext {
  color:#666666;
  font-size: 14px;
  padding: 8px 12px;
  position: absolute;
  top: 250px;
  left:130px;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 5px;
  width: 5px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 0s;
  animation-name: fade;
  animation-duration: 0s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .prev, .next,.text {font-size: 11px;}
  .slideshow-container {width:100%;}
}

                                        /* fin css image slider découvrez toutes nos catégories responsive */ 
																	   						   
																	   
										 /* css image slider1 découvrez toutes nos catégories */
																	   

.mySlides1 {display: none}
img {vertical-align: middle;}

/* Slideshow container */
.slideshow1-container1 {
  max-width: 1130px;
  position: relative;
  margin: auto;
}

/* Next & previous buttons */
.prev1, .next1 {
  cursor: pointer;
  position: absolute;
  top: 30%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: #CCCCCC;
  background:#FFFFFF;
  font-weight: bold;
  font-size: 10px;
  transition: 0.6s ease;
  border: 1px solid #CCCCCC;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next1 {
  right: 0px;
  border-radius: 3px 0 0 3px;
}

.prev1 {
  left: 0px;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev1:hover, .next1:hover {
  background-color: #CCCCCC; color: #FFFFFF;
}

/* Caption text */
.text1 {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/10 etc) */
.numbertext1 {
  color:#666666;
  font-size: 14px;
  padding: 8px 12px;
  position: absolute;
  top: 250px;
  left:130px;
}

/* The dots/bullets/indicators */
/* The dots/bullets/indicators */
.dot1 {
  cursor: pointer;
  height: 2px;
  width: 2px;
  margin: 0 2px;
  border:1px solid #CCCCCC;
  background-color: #FFFFFF;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot1:hover {
  background-color: #717171;
}

/* Fading animation */
.fade1 {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 0s;
  animation-name: fade;
  animation-duration: 0s;
}

@-webkit-keyframes fade1 {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade1 {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .prev1, .next1,.text1 {font-size: 11px}
}

                                          			/* fin css image slider1 découvrez toutes nos catégories */


#myBtn1{font-size:12px; color:#666666; border-radius: 5px/5px;}
#myBtn2{font-size:12px; color:#666666; border-radius: 5px/5px;}
#myBtn3{font-size:12px; color:#666666; border-radius: 5px/5px;}
#myBtn4{font-size:14px; color:#666666; border-radius: 5px/5px; background-color: #FFFFFF; border:1px solid #CCCCCC; padding:8px;}
#myBtn5{font-size:14px; color:#666666; border-radius: 5px/5px; background-color: #FFFFFF; border:1px solid #CCCCCC; padding:8px;}
#myBtn6{font-size:14px; color:#666666; border-radius: 5px/5px; background-color: #FFFFFF; border:1px solid #CCCCCC; padding:8px;}
#myBtn7{font-size:14px; color:#666666; border-radius: 5px/5px; background-color: #FFFFFF; border:1px solid #CCCCCC; padding:8px;}






																	    /* css modal 1 */	  
				

/* The Modal1 (background) */

.modal1 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 90px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal1-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  top:0;
  left:0px;
  border: 1px solid #888;
  width: 50%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

/* The Close Button */
.close1 {
  color: black;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close1:hover,
.close1:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal1-header {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}

.modal1-body {padding: 2px 16px; font-size:16px;}

.modal1-footer {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}	
@media only screen and (max-width: 800px) {
  .modal1 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 0px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal1-content {
  width: 95%;
}
}						

                                                                      /* fin css modal 1 */
																	  
																	  
																	  
															          /* css modal 2 */	  
				

/* The Modal1 (background) */

.modal2 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 90px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal2-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  top:0;
  left: 8px;
  border: 1px solid #888;
  width: 90%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

/* The Close Button */
.close2 {
  color: white;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close2:hover,
.close2:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal2-header {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}

.modal2-body {padding: 2px 16px; font-size:16px;}

.modal2-footer {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}	
@media only screen and (max-width: 800px) {
  .modal2 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 0px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
}						

                                                                      /* fin css modal 2 */
																	  
																	  
																	  
															          /* css modal 3 */	  
				

/* The Modal1 (background) */

.modal3 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 90px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal3-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  top:0;
  left: 8px;
  border: 1px solid #888;
  width: 90%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

/* The Close Button */
.close3 {
  color: white;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close3:hover,
.close3:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal3-header {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}

.modal3-body {padding: 2px 16px; font-size:16px;}

.modal3-footer {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}	
@media only screen and (max-width: 800px) {
  .modal3 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 0px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
}						

                                                                      /* fin css modal 3 */
																	  
															          /* css modal 4 */	  
				

/* The Modal4 (background) */

.modal4 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 999; /* Sit on top */
  padding-top: 90px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  z-index:999;
}

/* Modal Content */
.modal4-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  top:0;
  left:0px;
  border: 1px solid #888;
  width: 50%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s;
  z-index:999;
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

/* The Close Button */
.close4 {
  color: #FFFFFF;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close4:hover,
.close4:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal4-header {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}

.modal4-body {padding: 2px 16px; font-size:16px;}

.modal4-footer {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}	
@media only screen and (max-width: 800px) {
  .modal4 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 0px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal4-content {
  width: 100%;
}
}						

                                                                      /* fin css modal 4 */
																	  
																	  /* css modal 5 */	  
				

/* The Modal5 (background) */

.modal5 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 90px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  z-index:999;
}

/* Modal Content */
.modal5-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  top:0;
  left:0px;
  border: 1px solid #888;
  width: 50%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s;
  z-index:999;
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

/* The Close Button */
.close5 {
  color: #FFFFFF;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close5:hover,
.close5:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal5-header {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}

.modal5-body {padding: 2px 16px; font-size:16px;}

.modal5-footer {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}	
@media only screen and (max-width: 800px) {
  .modal5 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 0px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal5-content {
  width: 100%;
}
}						

                                                                      /* fin css modal 5 */
																	  
																	  /* css modal 6 */	  
				

/* The Modal6 (background) */

.modal6 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 999; /* Sit on top */
  padding-top: 90px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  z-index:999;
}

/* Modal Content */
.modal6-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  top:0;
  left:0px;
  border: 1px solid #888;
  width: 50%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s;
  z-index:999;
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

/* The Close Button */
.close6 {
  color: #FFFFFF;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close6:hover,
.close6:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal6-header {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}

.modal6-body {padding: 2px 16px; font-size:16px;}

.modal6-footer {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}	
@media only screen and (max-width: 800px) {
  .modal6 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 0px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal6-content {
  width: 100%;
}
}						

                                                                      /* fin css modal 6 */
																	  
																	  /* css modal 7 */	  
				

/* The Modal7 (background) */

.modal7 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 999; /* Sit on top */
  padding-top: 90px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  z-index:999;
}

/* Modal Content */
.modal7-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  top:0;
  left:0px;
  border: 1px solid #888;
  width: 50%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s;
  z-index:999;
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

/* The Close Button */
.close7 {
  color: #FFFFFF;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close7:hover,
.close7:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal7-header {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}

.modal7-body {padding: 2px 16px; font-size:16px;}

.modal4-footer {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}	
@media only screen and (max-width: 800px) {
  .modal7 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 0px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal7-content {
  width: 100%;
}
}						

                                                                      /* fin css modal 7 */